<!--
 * @Description: 
 * @Author: dh
 * @Date: 2022-01-12 11:04:37
 * @LastEditors: dh
 * @LastEditTime: 2022-01-12 11:04:38
-->
<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
	</head>
	<!-- 响应式图片的优点是浏览器能够根据屏幕大小自动加载合适的图片。 -->
	<body>
		<!-- 没测试 -->
		<picture>
			<source srcset="banner_w1000.jpg" media="(min-width: 801px)" />
			<source srcset="banner_w800.jpg" media="(max-width: 800px)" />
			<img src="banner_w800.jpg" alt="" />
		</picture>
	</body>
</html>
